<template>
  <div class="login-container">
    <div class="logo">
      <img src="@/assets/login.png">
    </div>
    <main>
      <div class="user-msg">
        <van-cell-group>
          <van-field v-model="uname"
                     left-icon="contact"
                     placeholder="请输入用户名" />

          <van-field v-model="upwd"
                     type="password"
                     left-icon="points"
                     placeholder="请输入密码" />
        </van-cell-group>
        <router-link to="/register"
                     class="register">立即注册</router-link>
        <van-button type="info"
                    size="large"
                    round
                    @click="login">登录</van-button>
      </div>
    </main>
  </div>
</template>

<script>
import { Toast } from 'vant';

export default {
  data() {
    return {
      uname: this.$route.query.uname || '',
      upwd: this.$route.query.upwd || ''
    }
  },
  created() {

  },
  methods: {
    // 登录
    login() {
      if (!(this.uname && this.upwd)) {
        Toast('内容不能为空')
        return
      }
      let user = { uname: this.uname, upwd: this.upwd }
      this.axios.get('/user/login', { params: user }).then(res => {
        if (res.data.code == 0) {
          Toast(res.data.msg)
        } else if (res.data.code == 1) {
          localStorage.setItem('user', JSON.stringify(res.data.user))
          if (res.data.user.rank == 0) {
            // console.log('admin')
            this.$router.push({ path: 'my' })
          } else if (res.data.user.rank == 1) {
            // console.log('用户')
            this.$router.push({ path: 'my' })
          } else if (res.data.user.rank == 2) {
            // console.log('商家')
            this.$router.push({ path: 'my' })
          }
        }
      })
    }
  }
}
</script>

<style lang="scss">
.login-container {
  .logo {
    text-align: center;
    padding-top: 1rem;
    img {
      width: 4.2rem;
      height: 4.2rem;
    }
  }
  main {
    margin: 1rem;
    border: 1px solid #aaa;
    border-radius: 8px;
    .user-msg {
      padding: 0.3rem;
      .van-cell {
        border-bottom: 1px solid #ccc;
        padding: 0.2rem;
        font-size: 0.4rem;
        margin: 0.2rem 0;
      }
      i {
        font-size: 0.5rem;
        line-height: 0.6rem;
      }
      .register {
        display: inline-block;
        font-size: 0.3rem;
        margin-bottom: 0.3rem;
        color: #1989fa;
      }
      .van-button--large {
        margin-top: 0.15rem;
        height: 1rem;
        line-height: 1rem;
      }
    }
  }
}
</style>